<template>
  <div class="personality">
    <div class="main">
      <div class="title">
        <div class="titleContent">
          <!-- logo -->
          <div class="titleFont" @click="toHome">
            <x-icon type="ios-arrow-back" size="24" fill="#fff"></x-icon>
            <span class="fontOne">个人中心</span>
          </div>
        </div>
      </div>
      <div
        class="personStyle"
        v-for="(item, index) in personalityMenus"
        :key="index"
        @click="routerPush(item)"
      >
        <a>{{ item.name }}</a>
        <x-icon type="ios-arrow-right" size="22" fill="#fff"></x-icon>
      </div>
      <div
        v-if="hasAuth(structureInfo)"
        class="personStyle"
        @click="toStructure"
      >
        <a>组织架构</a>
        <x-icon type="ios-arrow-right" size="22" fill="#fff"></x-icon>
      </div>
      <!--<div class="personStyle" @click="enterpriseSwitch"><a>企业切换</a>-->
      <!--<img src="../../assets/icon/toRight.png" alt=""><span>SWOT</span>-->
      <!--</div>-->
      <!-- <div v-show="isAdmin" class="personStyle" @click="routerPush(orderInfo)">
        <a>{{ orderInfo.name }}</a>
        <x-icon type="ios-arrow-right" size="22" fill="#fff"></x-icon>
      </div> -->
    </div>
    <div class="btn" @click="loginOutFn">退出登录</div>
  </div>
</template>

<script>
import { mapState } from "vuex";
import { XHeader } from "vux";
import { GetUser } from "@/mixin";
import host from "@/config/host";

export default {
  components: {
    XHeader
  },
  name: "personality",
  data() {
    return {
      isAdmin: false,
      userInfo: {},
      orderInfo: {
        pageId: "myOrder",
        name: "我的订单",
        sysType: 2
      },
      structureInfo: {
        pageId: "structure",
        name: "组织架构管理",
        orgType: [0],
        sysType: 2
      },
      personalityMenus: [
        {
          pageId: "personalityInformation",
          name: "个人信息",
          sysType: 2
        },
        {
          pageId: "changePassword",
          name: "密码修改",
          sysType: 2
        }
        // {
        //     pageId: "",
        //     name: "企业切换",
        //     sysType: 2
        // }
      ]
    };
  },
  mixins: [GetUser],
  inject: ["backToHomepage"],
  computed: {
    // 判断是否微信中打开
    isWechat() {
      return navigator.userAgent.toLowerCase().indexOf("micromessenger") > -1;
    },
    user() {
      return this.$store.state.user;
    }
  },
  methods: {
    toHome() {
      this.backToHomepage();
    },
    toStructure() {
      this.$router.push({
        name: "structure"
      });
      // window.location.href = `${host.systemUrl[2]}#/structure?ssoToken=true&ssoDomain=${window.location.origin}`;
    },
    //跳转
    routerPush(item) {
      if (item.pageId == "personalityInformation") {
        this.$router.push({
          name: item.pageId
        });
      } else if (item.pageId == "myOrder") {
        this.$router.push({
          name: item.pageId
        });
      } else {
        this.$router.push("/" + item.pageId);
      }
    },
    //退出登录
    loginOutFn() {
      // this.$http(this.$API.logout, {}, true)
      //   .then(res => {
      //     if (res) {
      //     }
      //   })
      //   .catch(err => {
      //     console.log(err);
      //   });
      localStorage.removeItem("userInfo");
      localStorage.removeItem("wechatOpenId");
      this.clearAllCookie();
      // if(this.isWechat){
      //     window.location.href = window.location.origin;
      // }else{
      // window.location.href = `${window.location.origin}/#/login`;
      // }
      // window.location.href = window.location.origin;
      // this.$router.replace("/login");
      this.backToHomepage();
    },
    enterpriseSwitch: function() {
      this.$router.push({
        name: "enterpriseSwitch",
        query: {
          
        }
      });
    },
    //判断登录状态
    loginStatus() {
      let user = localStorage.getItem("user");
      if (user) {
        this.userInfo = user;
        this.isAdmin = JSON.parse(this.userInfo).admin == 1 ? true : false;
      } else {
        this.$router.replace("/login");
      }
    },
    //清除所有cookie函数
    clearAllCookie() {
      var keys = document.cookie.match(/[^ =;]+(?=\=)/g);
      if (keys) {
        for (var i = keys.length; i--; )
          document.cookie =
            keys[i] +
            "=0;domain=.iuyun.com;expires=" +
            new Date(0).toUTCString() +
            ";path=/";
        document.cookie =
          keys[i] +
          "=0;domain=.iuindustry.com;;expires=" +
          new Date(0).toUTCString() +
          ";path=/";
      }
    },
    hasAuth(item) {
      if (!this.user) {
        return false;
      }
        return false;
    }
  },
  created() {
    // this.loginStatus();
    if (!this.$store.state.user) {
      this.getUser();
    }
  },
  mounted() {}
};
</script>

<style lang="less" scoped>
.personality {
  background: #22233f;
  height: 100vh;
  .personalityText {
    color: #000;
  }
  .main {
    .title {
      height: 50px;
      background: rgba(0, 0, 0, 0.4);
      color: #ffffff;

      .titleContent {
        width: 100%;
        height: 100%;
        padding: 0 15px;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .titleFont {
          display: flex;
          align-items: center;
          font-size: 15px;
        }

        .worksOrders {
          width: 40px;
          height: 40px;
        }
        .saoCode {
          width: 16px;
          height: 16px;
          margin-left: 16px;
        }
        .personal {
          width: 16px;
          height: 16px;
        }
      }
    }
    .personStyle {
      line-height: 60px;
      width: 90%;
      margin: 0 5%;
      font-size: 18px;
      text-align: left;
      color: #ffffff;
      border-bottom: rgba(255, 255, 255, 0.2) 1px solid;
      display: flex;
      justify-content: space-between;
      align-items: center;
      a {
        color: #ffffff;
      }
      // span {
      //   float: right;
      //   margin-right: 20px;
      //   color: rgba(255, 255, 255, 0.5);
      // }
      // img {
      //   width: 10px;
      //   height: 20px;
      //   float: right;
      //   margin: 20px 0;
      // }
    }
  }
  .btn {
    height: 50px;
    margin: 100px 20px 0 20px;
    line-height: 50px;
    text-align: center;
    background: #3967dc;
    border-radius: 20px;
    color: #ffffff;
    font-size: 16px;
  }
}
</style>
